<template>
  <div class="constion">
    <!-- 主体区域 -->
    <el-form
      :model="addcata"
      status-icon
      :rules="addrules"
      ref="refForm"
      label-width="80px"
    >
      <el-form-item label="所属学科" prop="xkname" v-if="!$route.query.id">
        <el-select
          v-model="addcata.xkname"
          placeholder="请选择学科"
          class="addselect"
        >
          <el-option
            v-for="(item, index) in cataAdd"
            :key="index"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="目录名称" prop="cataname">
        <el-input
          placeholder="请输入目录名称"
          v-model="addcata.cataname"
        ></el-input>
      </el-form-item>
    </el-form>
    <!-- 底部区域 -->
    <span slot="footer" class="dialog-footer">
      <el-button @click="$emit('addcata')">取 消</el-button>
      <el-button
        type="primary"
        @click="addcatalist"
        @chenkout="$emit('chenkout')"
        >确 定</el-button
      >
    </span>
  </div>
</template>

<script>
import { add } from '@/api/hmmm/directorys.js'
export default {
  props: {
    cataAdd: {
      type: Array,
      required: true
    }
  },
  data () {
    return {
      // 添加目录
      addcatainfo: [],
      addcata: {
        cataname: '',
        xkname: ''
      },
      // xkname:'',
      // cataname:'',
      // 验证规则
      addrules: {
        cataname: [
          {
            required: true,
            message: '请输入添加学科'
          },
          {
            min: 2,
            max: 8,
            message: '长度在 3 到 8 个字符',
            trigger: 'blur'
          }
        ]
      }
    }
  },
  methods: {
    // 添加目录
    addcatalist () {
      this.$refs.refForm.validate(async (valid) => {
        //  console.log(valid);
        if (!valid) return
        try {
          if (this.$route.query.id) {
            await add({
              subjectID: parseInt(this.$route.query.id),
              directoryName: this.addcata.cataname
            })
          } else {
            await add({
              subjectID: this.addcata.xkname,
              directoryName: this.addcata.cataname
            })
          }

          this.$message.success('添加目录成功')
          this.$emit('addcata')
        } catch (err) {

        }
      })
    }
  },
  created () {}
}
</script>

<style lang="scss" scoped>
.dialog-footer {
  display: flex;
  justify-content: flex-end;
}
.el-dialog {
  min-width: 100%;
}
.el-select {
  min-width: 100%;
}
</style>
